<template>

    <div >

        <van-divider :style="{ color: '#ee0a24', borderColor: '#ee0a24', padding: '0 16px' }" content-position="center">
            我的信息
        </van-divider>

        <van-cell-group inset>
            <van-cell title="姓名" :value="user.name"/>
            <van-cell title="护照号" :value="user.passport"/>
            <van-cell title="电话" :value="user.phone"/>
            <van-cell title="生日" :value="user.birthday"/>
            <van-cell title="积分" :value="user.point"/>
        </van-cell-group>

        <van-divider :style="{ color: '#ee0a24', borderColor: '#ee0a24', padding: '0 16px' }" content-position="center">
            我的订单
        </van-divider>

        <van-cell-group class="order" inset v-for="order in orders">


            <div v-if="order.goods_id"  >
                <van-cell value-class="cell-value" title="商品名称" :value="order.get_goods.title"/>
                <van-cell title="收货人电话" :value="order.tel"/>
                <van-cell title="收货地址" :value="order.address"/>
                <van-cell title="所需积分" :value="order.need_point"/>
                <van-cell title="数量" :value="order.exchange_num"/>
                <van-cell title="状态" :value="order.client_status_name"/>
                <van-cell title="下单时间" :value="order.created_at"/>
                <van-cell v-if="order.beizh"  title="备注" :value="order.beizhu"/>
            </div>

            <div v-else >
                <van-cell value-class="cell-value" title="航班号" :value="order.fly_number"/>
                <van-cell title="订票日期" :value="order.booking_date"/>
                <van-cell title="赢得积分" :value="order.need_point"/>
                <van-cell :value-class="{'cell-value-check':order.status==1}" title="状态" :value="order.status_name"/>
                <van-cell title="上传时间" :value="order.created_at"/>
            </div>



        </van-cell-group>
    </div>


</template>

<script>
export default {

    name: "User",

    data() {
        return {
            user: '',
            orders: [],
        };
    },
    mounted() {
        this.userInfo()
        this.getUserOrder()
    },
    methods: {

        getUserOrder() {
            this.$myGetHttp(this.$myUrl.getUserOrder,{user_id: localStorage.getItem('userId')}).then(res => {
                this.orders = res.records
            })
        },
        userInfo() {
            this.$myGetHttp(this.$myUrl.user,{id:localStorage.getItem('userId')}).then(res => {
                this.user = res.records
            })
        }
    }

}
</script>

<style scoped>
.cell-value {
    color: #ee0a24;
}

.cell-value-check{
    color: #FF976A;
}

.order{
    margin-top: 5px;
}

</style>
